<style lang="scss" scoped>
	@import "../../utils/base.scss";
    .p_content{
        font-size:13px;
        min-width: 100px;
        max-width: 200px;
        height: auto;
        word-wrap:break-word;
        word-break:break-all;
        overflow: hidden;
        padding-bottom: 4px;
    }
   
</style>
<template>
	<div ref='base' class="quest_content" style="overflow-y:auto">
		<template id="baseInfo">
			<component ref="baseInfo" :is="'baseInfo'"  :reqId="reqId" :baseInfo="object.user"></component>
		</template>

		<template id="projectInfo">
			<div class="qheader" :style="{borderBottom: ifedit ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
				<p>项目信息</p>
			</div>
			<div class="gcontent">
				<Form :model="object.project" :label-width="140" label-position="left" class="form form_left">
					<Row>
						<Col span="8">
						<FormItem label="工单标题：" :required="true">
							<Input v-model="object.reqSubject" :readonly="ifedit" placeholder="XX租户申请配置金库审批" />
						</FormItem>
						</Col>
					</Row>
					<Row>
						<Col span="8">
						<FormItem label="提单租户：" :required="true">
							<Input v-if="ifedit" v-model="object.role.tenant_name" :readonly="readonly" />
							<Select v-else filterable v-model="object.roleId" :label-in-value="true" @on-change="selectTenant" :disabled="ifedit">
								<Option v-for="(i,index) in tenantList" :value="i.id" :key="index">{{i.tenant_name}}</Option>
							</Select>
						</FormItem>
						</Col>
						<Col span="8" class="col_left">
						<FormItem label="所属项目：" :required="true">
							<Input v-if="ifedit" v-model="object.project.project" :readonly="readonly" />
							<Select v-else filterable v-model="object.projectId" @on-change="getProjectInfo" :disabled="ifedit">
								<Option v-for="(item,index) in projectList" :value="item.id" :key="index">{{item.project}}</Option>
							</Select>
						</FormItem>
						</Col>
					</Row>
					<Row>
						<Col span="8">
						<FormItem label="入驻位置：">
							<Input v-model="object.project.position" :readonly="readonly" />
						</FormItem>
						</Col>
						<Col span="8" class="col_left">
						<FormItem label="项目类型：">
							<Input v-model="object.project.projectType" :readonly="readonly" />
						</FormItem>
						</Col>
					</Row>
					<Row>
						<Col span="8">
						<FormItem label="项目经理：">
							<Input v-model="object.project.manager" :readonly="readonly" />
						</FormItem>
						</Col>
						<Col span="8" class="col_left">
						<FormItem label="经理联系方式:">
							<Input v-model="object.project.manager_phone" :readonly="readonly" />
						</FormItem>
						</Col>
					</Row>
					<Row>
						<Col span="8">
						<FormItem label="运营人员：">
							<Input v-if="object.project.business!=null && object.project.business!=undefined && object.project.business!=''"
							 v-model="object.project.business" :readonly="readonly" />
							<Input v-else v-model="object.project.tenant_business" :readonly="readonly" />
						</FormItem>
						</Col>
					</Row>
					<!--                     <Row >
                        <Col span="22" style="width:96.666667%">
                            <FormItem label="项目描述：" >
                                <Input v-model="object.project.des" type="textarea" :autosize="{minRows: 4,maxRows: 6}" :readonly="readonly" />
                            </FormItem>
                        </Col>
                    </Row> -->
				</Form>
			</div>
		</template>

		<template id="projectInfo">
			<div class="qheader" :style="{borderBottom: ifedit ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
				<p>申请信息</p>
			</div>
			<div class="gcontent">
				<Form :model="object.project" :label-width="140" label-position="left" class="form form_left">
					<Row>
						<Col span="23">
						<FormItem label="需求描述：" :required="true">
							<Input v-model="object.reqDes" type="textarea" maxlength="250" show-word-limit :rows="5" style="width:96%"
							 :readonly="ifedit" />
						</FormItem>
						</Col>
					</Row>
				</Form>
			</div>
		</template>

		<!-- 附件 -->
		<template>
			<div class="qheader" :style="{borderBottom: '1px solid rgb(210,210,210)',}">
				<p>附件</p>
			</div>
			<component ref="file" :is="'file'" :ifedit="ifedit" :filesList="filesList" v-model="object.files"></component>
		</template>
	</div>
</template>

<script>
	import ajax from "../../ajax_util"
	import Axios from 'axios'
	import notice from '../../base/notice'
	import file from './settledin/file'
	import fileUpload from '../../base/file_uploader'
	import fileModal from '../../base/file_modal'
	import fileDownload from '../../base/file_download'
	import baseInfo from './person_baseInfo'

	export default {
		name: "apply",
		components: {
			notice,
			file,
			fileUpload,
			fileModal,
			fileDownload,
			baseInfo
		},
		data() {
			return {

				readonly: true,
				tenantList: [],
				projectList: [],
				object: {
					files: [
						// {
						// 	fileName: "",
						// 	fileUrl: ""
						// }
					],
					project: {
						create_time: 0,
						cycle: "",
						des: "",
						end_time: 0,
						id: 0,
						isContract: "",
						isWithDraw: 0,
						manager: "",
						manager_phone: "",
						position: "",
						project: "",
						projectType: "",
						tenant_id: 0,
						tenant_name: "",
						business: "",
						tenant_business: "",
						withDrawTime: 0
					},
					projectId: 0,
					reqId: 0,
					reqSubject: "",
					role: {
						id: 0,
						tenant_name: ""
					},
					roleId: 0,
					user: {
						email: "",
						id: 0,
						id_card: "",
						phone: "",
						user_name: "",
						department: ""
					},
					userId: 0,
					reqDes: "",
				},
				tenant: {},
				userId: 0
			}
		},
		mounted: function() {
			console.log("!!!!!!!!!!!!", this.$store.state.user, this.reqId);
			if (this.reqId == null && this.draftsId == null) {
				this.getBaseInfo();
			} else if (this.reqId != null) {
				this.getApplyInfo();
				if(!this.ifedit){
					this.getTenants(this.userId);
					this.selectTenant(this.tenant);
				}
			} else if (this.draftsId != null) {
				this.getDrafts();
			}
		},
		methods: {
			getBaseInfo() {
				this.object.userId = this.$store.state.user.id;
				this.object.user.id = this.$store.state.user.id;
				this.object.user.userName = this.$store.state.user.user_name;
				this.object.user.applyCardId = this.$store.state.user.id_card;
				this.object.user.telephone = this.$store.state.user.phone;
				this.object.user.email = this.$store.state.user.email;
				this.object.user.applydept = this.$store.state.user.department;
				this.getTenants(this.object.user.id);
			},
			getApplyBaseInfo() {
				this.object.userId = this.processInfo.base.userFBean.id;
				this.object.user.id = this.processInfo.base.userFBean.id;
				this.object.user.userName = this.processInfo.base.userFBean.user_name;
				this.object.user.applyCardId = this.processInfo.base.userFBean.id_card;
				this.object.user.telephone = this.processInfo.base.userFBean.phone;
				this.object.user.email = this.processInfo.base.userFBean.email;
				this.object.user.applydept = this.processInfo.dptName;
			},
			getApplyInfo() {
				console.log("getApplyInfo------this.processInfo--->", this.processInfo);
				this.getApplyBaseInfo();
				this.object.object = this.processInfo.content;
				this.object.projectId = this.processInfo.base.project.id;
				this.object.project = this.processInfo.base.project;
				this.object.roleId = this.processInfo.base.role.id;
				this.object.role = this.processInfo.base.role;
				//this.object.user = this.processInfo.base.userFBean;
				this.object.files = this.processInfo.files;
				this.object.reqSubject = this.processInfo.reqSubject;
				this.object.reqDes = this.processInfo.reqDes;
				this.tenant.value = this.processInfo.base.role.id;
				this.tenant.label = this.processInfo.base.role.tenant_name;
				this.userId = this.processInfo.base.userFBean.id;
			},
			getDrafts() {
				var url = this.CONFIG.base_url_test + "/draft/content/" + this.draftsId;
				var that = this;
				ajax.get({
					url: url,
					that: that,
					params: null,
					success: function(data) {
						console.log("-----getDrafts-----", data);
						that.object = data.req;
						console.log("-----22222-----", that.object);
						that.getTenants(that.object.userId);
					}
				})
			},
			getTenants(userId) {
				var url = this.CONFIG.url_know + "/tenantByUserId/" + userId;
				var that = this;
				ajax.get({
					url: url,
					that: that,
					params: null,
					success: function(data) {
						console.log("------55555-----------", data)
						that.tenantList = data;

						if (that.object.role.id != null && that.object.role.id != undefined && that.object.role.id != "") {
							var tenant = {};
							tenant.value = that.object.role.id;
							tenant.label = that.object.role.tenant_name;
							that.selectTenant(tenant);
						}
					}
				})
			},
			selectTenant(tenant) {
				console.log("---------tenant-----", tenant)
				this.object.role.id = tenant.value;
				this.object.role.tenant_name = tenant.label;

				this.tenantList.some(item => {
					console.log("========item======", item);
					if (tenant.value == item.id) {
						this.projectList = item.projects;
						return true
					}
				})

				// var that=this;
				// var url = this.CONFIG.url_know + "/getProjects/" + tenant.value;
				// ajax.get({
				//     url: url,
				//     that: that,
				//     params: null,
				//     success:function(data){
				//         console.log("---------data-----",data)
				//         that.projectList = data
				//         if(data.length==0){
				//         	that.object.projectId=0;
				//         }
				//     }
				// })
			},
			getProjectInfo(id) {
				this.projectList.some(item => {
					if (item.id === id) {
						console.log("============", item);
						item.create_time = 0;
						item.end_time = 0;
						this.object.project = item;
						return true;
					}
				})
			},
			dateFormat(event) {
				var date = new Date(event);
				return (date.getTime() / 1000);
			},
			addRow() {
				this.object.object.push({
					des: "",
					id: 0,
					ip: "",
					overId: 0
				});
			},
			remove(index) {
				this.object.object.splice(index, 1);
			},
			validate() {
				if (this.object.reqSubject == '') {
					this.$Message.error({
						content: '请填写工单标题!',
						duration: 3
					});
					return false;
				} else if (this.object.reqSubject.length > 50) {
					this.$Message.error({
						content: '工单标题最多填写50个字符',
						duration: 3
					});
					return false;
				} else if (this.object.roleId == null || this.object.roleId == 0) {
					this.$Message.error({
						content: '请选择提单租户!',
						duration: 3
					});
					return false;
				} else if (this.object.projectId == null || this.object.projectId == 0) {
					this.$Message.error({
						content: '请选择所属项目!',
						duration: 3
					});
					return false;
				} else if (this.object.reqDes == null || this.object.reqDes == "") {
					this.$Message.error({
						content: '请填写需求描述!',
						duration: 3
					});
					return false;
				} else {
					return true;
				}
			},
			getInfo() {
				var object = {};
				object = this.object;
				object.base = {
					dptName: this.object.user.applydept
				}
				object.object = {
					roleId: this.object.roleId,
					projectId: this.object.projectId
				}
				return object;
			},
			// 获取处理时需要提交的参数
			getHandleParams(handleInfo) {
				handleInfo.reqSubject = this.object.reqSubject
				handleInfo.startTime = parseInt(new Date(0).getTime() / 1000)
				handleInfo.hopeTime = parseInt(new Date(0).getTime() / 1000)
				handleInfo.reqDes = this.object.reqDes;
				handleInfo.isEdit = this.isEdit;
				console.log("aaaa-------->", this.ifedit, this.isEdit == 1)
				handleInfo.isChangeContent = 0;
				if (!this.ifedit) {
					handleInfo.isChangeContent = 1;
				}
				if (this.isEdit == 1) {
					handleInfo.roleId = this.object.roleId;
					handleInfo.projectId = this.object.projectId;
					handleInfo.reqDes = this.object.reqDes;
					handleInfo.content = this.getInfo()
				}
			},
			//处理页面获取下一步处理人需要的参数
			getHandleUserParams(opOptions) {
				var param = {}
				if (opOptions != "") {
					param.vari = opOptions
				}
				param.roleId = this.object.roleId;
				param.projectId = this.object.projectId;
				return param
			},
		},
		props: {
			isEdit: {},
			value: {
				dafault: false
			},
			ifedit: {
				type: Boolean,
				default: false,
			},
			reqId: {
				default: null
			},
			draftsId: {
				default: null
			},
			filesList: {},
			processInfo: {},
		},
		watch: {
			ifedit(Val) {
				console.log("=======ifedit===========", Val);
				this.getTenants(this.userId);
				this.selectTenant(this.tenant);
			}
		}
	}
</script>
